<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>jstree操作</title>
		<link rel="stylesheet" href="lib/jstree/style.min.css" />
	</head>

	<body>
		<input id="allSelect" type="checkbox" /> <label for="allSelect">全选</label>
		<button id="selectData">选中的数据</button>

		<div id="jstree"></div>

		<script src="lib/jquery.min.js"></script>
		<script src="lib/jstree/jstree.min.js"></script>
		<script>
			var jstreeNode=$('#jstree'); //树节点
			
			jstreeNode.jstree({
				'core': {
					'data': [{
						'text': 'rootNode',
						'children': [{
							'text': 'child'
						}]
					}, {
						'text': 'rootNode2',
						'children': [{
							'text': 'child'
						}]
					}, {
						'text': 'rootNode3',
						'children': [{
							'text': 'child'
						}]
					}]
				},
				'plugins': ['checkbox']
			});

			//全选和取消全选
			$('#allSelect').on('click', function() {
				if(this.checked) {
					jstreeNode.jstree('select_all'); //全选
				} else {
					jstreeNode.jstree('deselect_all'); //取消全选
				}

			});

			//获取选中节点信息
			$('#selectData').on('click', function() {
				var nodeData=jstreeNode.jstree().get_checked(); //获取所有选中的节点ID
				var nodeTree=jstreeNode.jstree().get_checked(true); //获取所有选中的节点对象
				console.log(nodeData);
				console.log(nodeTree);
			});

		</script>
	</body>

</html>